<template>
  <div class="p-2">
    <BasicTable @register="registerTable">
      <template #bodyCell="{ column, record }">
        <template v-if="column.key === 'id'"> ID: {{ record.id }}</template>
        <template v-else-if="column.key === 'completed'">
          <Tag v-if="record.completed == 'wait'" color="#f50">待生成</Tag>
          <Tag v-else-if="record.completed == 'pending'" color="blue">生成中</Tag>
          <Tag v-else-if="record.completed == 'completed'" color="green">已生成</Tag>
        </template>
        <template v-else-if="column.key === 'category_completed'">
          <div v-if="record.category_completed == 'wait'">
            <a-button
              color="warning"
              :loading="record.category_loading_state"
              @click="generate_category_data(record)"
            >待生成
            </a-button
            >
          </div>
          <div v-else-if="record.category_completed == 'pending'">
            <a-button type="primary" :loading="true">生成中</a-button>
          </div>
          <a-button v-else-if="record.category_completed == 'completed'" color="success"
          >已生成
          </a-button
          >
        </template>
        <template v-else-if="column.key === 'order_asin_completed'">
          <a-button
            v-if="record.order_asin_completed == 'wait'"
            color="warning"
            :loading="record.asin_loading_state"
            @click="generate_asin_data(record)"
          >待生成
          </a-button
          >
          <a-button
            v-else-if="record.order_asin_completed == 'pending'"
            color="primary"
            :loading="true"
          >生成中
          </a-button
          >
          <a-button v-else-if="record.order_asin_completed == 'completed'" color="success"
          >已生成
          </a-button
          >
        </template>
        <template v-else-if="column.key === 'order_product_completed'">
          <a-button
            v-if="record.order_product_completed == 'wait'"
            color="warning"
            :loading="record.order_loading_state"
            @click="generate_product_data(record)"
          >待生成
          </a-button
          >
          <a-button
            v-else-if="record.order_product_completed == 'pending'"
            color="primary"
            :loading="true"
          >生成中
          </a-button
          >
          <a-button v-else-if="record.order_product_completed == 'completed'" color="success"
          >已生成
          </a-button
          >
        </template>
        <template v-else-if="column.key === 'update_sj_name_completed'">
          <a-button
            v-if="record.update_sj_name_completed == 'wait'"
            color="warning"
            :loading="record.sj_loading_state"
            @click="generate_sj_data(record)"
          >待生成
          </a-button
          >
          <a-button
            v-else-if="record.update_sj_name_completed == 'pending'"
            color="primary"
            :loading="true"
          >生成中
          </a-button
          >
          <a-button v-else-if="record.update_sj_name_completed == 'completed'" color="success"
          >已生成
          </a-button
          >
        </template>
        <template v-else-if="column.key === 'update_sj_name_extra_completed'">
          <a-button
            v-if="record.update_sj_name_extra_completed == 'wait'"
            color="warning"
            :loading="record.python_loading_state"
            @click="generate_sj_python_data(record)"
          >待生成
          </a-button
          >
          <a-button
            v-else-if="record.update_sj_name_extra_completed == 'pending'"
            color="primary"
            :loading="true"
          >生成中
          </a-button
          >
          <a-button v-else-if="record.update_sj_name_extra_completed == 'completed'" color="success"
          >已生成
          </a-button
          >
        </template>
        <template v-else-if="column.key === 'update_category_completed'">
          <a-button
            v-if="record.update_category_completed == 'wait'"
            color="warning"
            :loading="record.update_loading_state"
            @click="generate_order_num_data(record)"
          >待生成
          </a-button
          >
          <a-button
            v-else-if="record.update_category_completed == 'pending'"
            color="primary"
            :loading="true"
          >生成中
          </a-button
          >
          <a-button v-else-if="record.update_category_completed == 'completed'" color="success"
          >已生成
          </a-button
          >
        </template>
        <template v-else-if="column.key === 'low_orders_completed'">
          <a-button
            v-if="record.low_orders_completed == 'wait'"
            color="warning"
            :loading="record.low_loading_state"
            @click="generate_low_order_data(record)"
          >待生成
          </a-button
          >
          <a-button
            v-else-if="record.low_orders_completed == 'pending'"
            color="primary"
            :loading="true"
          >生成中
          </a-button
          >
          <a-button v-else-if="record.low_orders_completed == 'completed'" color="success"
          >已生成
          </a-button
          >
        </template>
        <template v-else-if="column.key === 'sync_asin_system'">
          <a-button v-if="record.sync_asin_system == 'wait' || record.sync_asin_system == 'completed'"
                    type="primary"
                    danger
                    :loading="record.sync_loading_state"
                    @click="sync_asin_to_system_data(record)"
          >开始同步
          </a-button>
          <a-button
            v-else-if="record.sync_asin_system == 'pending'"
            color="primary"
            :loading="true"
          >生成中
          </a-button>
        </template>
      </template>
      <template #toolbar>
        <Popconfirm
          title="是否确定要生成上月报表预处理数据?"
          ok-text="是"
          cancel-text="否"
          @confirm="confirm"
        >
          <a-button type="primary"> 生成上月</a-button>
        </Popconfirm>
      </template>
    </BasicTable>
  </div>
</template>
<script lang="tsx" setup>
import {h, ref} from 'vue'
import {BasicTable, TableAction, useTable, BasicColumn, TableImg} from '/@/components/Table'
import {Tag, Popconfirm, message} from 'ant-design-vue'
import {
  taskInfoApi,
  createTaskInfo,
  generate_category,
  generate_order_asin,
  generate_order_product,
  generate_sj_name,
  generate_sj_python,
  generate_order_num,
  generate_low_order,
  sync_asin_to_system
} from '/@/api/demo/task'

const columns: BasicColumn[] = [
  {
    title: '月份',
    dataIndex: 'month',
    fixed: 'left',
    width: 100,
  },
  {
    title: '是否完成',
    dataIndex: 'completed',
    width: 130,
    align: 'center',
  },
  {
    title: '分类已完成',
    dataIndex: 'category_completed',
    width: 160,
  },
  {
    title: 'asin获取状态',
    dataIndex: 'order_asin_completed',
    width: 160,
  },
  {
    title: '产品是否完成',
    dataIndex: 'order_product_completed',
    width: 160,
  },
  {
    title: '更新数据名状态',
    dataIndex: 'update_sj_name_completed',
    width: 160,
  },
  {
    title: '更新数据名状态(python)',
    dataIndex: 'update_sj_name_extra_completed',
    width: 220,
  },
  {
    title: '订单量等信息是否完成',
    dataIndex: 'update_category_completed',
    width: 160,
  },
  {
    title: '低订单分析数据',
    dataIndex: 'low_orders_completed',
    width: 160,
  },
  {
    title: '限制ASIN同步系统',
    dataIndex: 'sync_asin_system',
    width: 160,
  },
  {
    title: '创建时间',
    dataIndex: 'create_time',
  },
]

const [registerTable, {reload}] = useTable({
  title: '月份数据预处理',
  titleHelpMessage: '每月数据请在此处处理完毕后，再去查看分析页面！',
  api: taskInfoApi,
  columns: columns,
  bordered: true,
  showTableSetting: true,
  showIndexColumn: false,
})

//获取该月分类
function generate_category_data(record) {
  record.category_loading_state = true
  generate_category({month: record.month}).then(
    () => {
      setTimeout(function () {
        message.success('操作成功！')
        reload()
      }, 2000)
    },
    () => {
      record.category_loading_state = false
    },
  )
}

//获取asin
function generate_asin_data(record) {
  record.asin_loading_state = true
  generate_order_asin({month: record.month}).then(
    () => {
      setTimeout(function () {
        message.success('操作成功！')
        reload()
      }, 800)
    },
    () => {
      record.asin_loading_state = false
    },
  )
}

//获取Keepa产品详情
function generate_product_data(record) {
  record.order_loading_state = true
  generate_order_product({month: record.month}).then(
    () => {
      setTimeout(function () {
        message.success('操作成功！')
        reload()
      }, 800)
    },
    () => {
      record.order_loading_state = false
    },
  )
}

//获取Keepa产品详情
function generate_sj_data(record) {
  record.sj_loading_state = true
  generate_sj_name({month: record.month}).then(
    () => {
      setTimeout(function () {
        message.success('操作成功！')
        reload()
      }, 800)
    },
    () => {
      record.sj_loading_state = false
    },
  )
}

//获取Keepa产品详情
function generate_sj_python_data(record) {
  record.python_loading_state = true
  generate_sj_python({month: record.month}).then(
    () => {
      setTimeout(function () {
        message.success('操作成功！')
        reload()
      }, 800)
    },
    () => {
      record.python_loading_state = false
    },
  )
}

//获取订单量等数据
function generate_order_num_data(record) {
  record.update_loading_state = true
  generate_order_num({month: record.month}).then(
    () => {
      setTimeout(function () {
        message.success('操作成功！')
        reload()
      }, 800)
    },
    () => {
      record.update_loading_state = false
    },
  )
}

//获取低订单asin分析数据
function generate_low_order_data(record) {
  record.low_loading_state = true
  generate_low_order({month: record.month}).then(
    () => {
      setTimeout(function () {
        message.success('操作成功！')
        reload()
      }, 800)
    },
    () => {
      record.low_loading_state = false
    },
  )
}

//获取低订单asin分析数据
function sync_asin_to_system_data(record) {
  record.sync_loading_state = true
  sync_asin_to_system({month: record.month}).then(
    () => {
      setTimeout(function () {
        message.success('操作成功！')
        reload()
      }, 800)
    },
    () => {
      record.sync_loading_state = false
    },
  )
}

const confirm = () => {
  createTaskInfo().then(
    (res) => {
      message.success('生成成功！')
      reload()
    },
    (error) => {
      console.log(error)
    },
  )
}
</script>
